<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:f="http://java.sun.com/jsf/core" 
      xmlns:ui="http://java.sun.com/jsf/facelets" 
      xmlns:a4j="http://richfaces.org/a4j" 
      xmlns:rich="http://richfaces.org/rich"> 

<h:head>

<script src="resources/javascript/jquery-1.4.2.js"></script>
<script src="resources/javascript/jquery.hotkeys.js"></script>
        
 <h:outputScript>
        function containsFilter(subString, value){
            if(subString.length>=1) {
                if(value.indexOf(subString)!=-1) 
                    return true;
            }else return false;
        };

    </h:outputScript>

  <h:outputStylesheet> 
.head2 {
 background-image: url();
    background-color: #4C9600;
    height: 18px;
    text-align: center;
    vertical-align: middle;
    color:  #000000 ;
    padding: 4px 0;
}
.button {
    background-image: url('resources/images/ai.gif');
}
</h:outputStylesheet>


</h:head> 
<body>

   
    
           		<rich:panel  id="mainPanal">
				       <f:facet name="header" >
				           <h:outputLabel value="#{msgs.salesapp}" style="COLOR: #3479b1; font-size:20px;" /> 
				           
				       </f:facet> 
    
    <h:form id="myform">
        
			<rich:notify stayTime="1599" id="status_msg" 
			 detail="#{saleBacking.saleSavingStatus}" rendered="#{not empty saleBacking.saleSavingStatus}">
			    <f:facet name="summary">
			        Notification
			    </f:facet>
			</rich:notify>
    
    <a4j:status>
            <f:facet name="start">
                <h:graphicImage value="resources/images/ai.gif" alt="ai"/>
            </f:facet>
</a4j:status>
    
    
    
		<h:panelGrid columns="3" id="master" width="100%" >      	
            
		<h:panelGroup>
            <fieldset class="demo_fieldset" > 
           <legend class="demo_legend"><B style="COLOR: #3479b1; font-size:20px;">بيانات البيع</B></legend> 
         
					<h:panelGrid columns="2">
								<h:outputLabel value="الوصف" for="desc"  style="font-size:20px;"/>
		            <h:inputText id="desc"  value="#{saleBacking.sale.note}" title="الوصف" tabindex="0" />
		            
		            <h:outputLabel value="تاريخ الاستحقاق" for="date1"  style="font-size:20px;"/>       
		            <rich:calendar id="date1" enableManualInput="false" value="#{saleBacking.sale.saleDate}" />
		            
		            <h:outputLabel value="رقم القيد" for="reg_numb"  style="font-size:20px;"/>
		            <h:inputText id="reg_numb" value="#{saleBacking.sale.jvNo}" title="رقم القيد" />

					
			  	    </h:panelGrid>
		  
		   </fieldset>
		 </h:panelGroup>             
			
			
		<h:panelGroup>
            <fieldset class="demo_fieldset"> 
           <legend class="demo_legend"><B style="COLOR: #3479b1; font-size:20px;">بيانات الدفع</B></legend> 
         
                <h:panelGrid columns="2">

		                    <h:outputLabel value="كاش" for="cash" style="font-size:20px;"/>
				             <rich:inputNumberSpinner value="#{saleBacking.sale.cash}" id="cash" label="dd"/>		
							
				            <h:outputLabel value="فيزا" for="visa"  style="font-size:20px;"/>
				             <rich:inputNumberSpinner value="#{saleBacking.sale.visa}" id="visa"/>		
							
				            <h:outputLabel value="كريديت" for="credit"  style="font-size:20px;"/>
				             <rich:inputNumberSpinner value="#{saleBacking.sale.credit}" id="credit"/>	
				             
				            <h:outputLabel value="الإجمالى" for="totalid"  style="font-size:20px;"/>            
							<h:inputText value="#{saleBacking.sale.total}" id="totalid" readonly="true">
								<f:convertNumber   pattern="0.0"  />
							</h:inputText>
					
    		     </h:panelGrid>
		  
		   </fieldset>
		 </h:panelGroup> 
		 
		 
		 <h:panelGroup>
	            <fieldset class="demo_fieldset"> 
	                    <legend class="demo_legend"><B style="COLOR: #3479b1; font-size:20px;">بيانات العميل</B></legend> 
			            <h:panelGrid columns="2">
			            		    <h:outputLabel value="اسم العميل" for="clientName"  style="font-size:20px;"/>
						            <h:inputText id="clientName" value="#{saleBacking.sale.clientName}"  />
						           
						            <h:outputLabel value="رقم الموبايل" for="mobileNum"  style="font-size:20px;"/>
						            <h:inputText id="mobileNum" value="#{saleBacking.sale.mobileNumber}"  />
						           
						            <h:outputLabel value="الإيميل" for="email"  style="font-size:20px;"/>
						            <h:inputText id="email" value="#{saleBacking.sale.email}" />
			            </h:panelGrid>
			   </fieldset>
		 </h:panelGroup> 
		 
 </h:panelGrid>

	<h:panelGroup id="detail"> 
	
		            <fieldset class="demo_fieldset"> 
	                    <legend class="demo_legend"><B style="COLOR: #3479b1; font-size:20px;">السلع المباعة</B></legend> 
				
							<rich:dataTable value="#{saleBacking.salesLines}" var="line" rows="50" id="datatable">
							
										<rich:column>
												<f:facet name="header">
												<h:outputLabel value="#{msgs.serial}" style="font-size:15px;"/> 
												</f:facet>
											    <h:inputText value="#{line.viewNo}" id="line"/>
										</rich:column>
										
										<rich:column>
											   <f:facet name="header"><h:outputLabel value="#{msgs.item}" style="font-size:15px;"/></f:facet>
									           <rich:select enableManualInput="true" 
									                        value="#{line.itemId}"
									                        clientFilterFunction="containsFilter"
									                        converter="#{itemConverter}"
									                        defaultLabel="برجاء كتابة اسم أو كود الصنف" 
									                        >
									                <f:selectItems value="#{saleBacking.items}" var="item" itemValue="#{item}" itemLabel="#{item.code} #{item.name}"/>
									            </rich:select>
									            
										</rich:column>
										
										<rich:column>
												<f:facet name="header"><h:outputLabel value="#{msgs.itemPrice}" style="font-size:15px;"/></f:facet>
												<h:inputText value="#{line.itemPrice}" >
													<f:convertNumber   pattern="00.00"  />
												</h:inputText>
										</rich:column>
										

										<rich:column>
												<f:facet name="header"><h:outputLabel value="#{msgs.qty}" style="font-size:15px;"/> </f:facet>
												<rich:inputNumberSpinner value="#{line.quantity}"/>	
										</rich:column>
										
										
										<rich:column>
												<f:facet name="header"><h:outputLabel value="#{msgs.barcode}" style="font-size:15px;"/> </f:facet>
												    <h:inputText value="#{line.barcode}" >
												</h:inputText>
										</rich:column>
									
											
											
										<rich:column>
												<f:facet name="header"><h:outputLabel value="#{msgs.totalNet}" style="font-size:15px;"/> </f:facet>
												<h:inputText value="#{line.netValue}" /> 
										</rich:column>
							
							
							            <rich:column>
												<f:facet name="header"><h:outputLabel value="#{msgs.notes}" style="font-size:15px;"/> </f:facet>
							
							<h:inputText    value="#{line.notes}" >
								<a4j:ajax   event="blur" 
											execute="datatable" 
											render="datatable" 
											immediate="true" 
											listener="#{saleBacking.addNewLineInDataTable}"
											oncomplete="document.getElementById('myform:datatable:#{saleBacking.view_no_counter-1}:line').focus();"/>
							</h:inputText>
							 
										</rich:column>
									
									
																				
							</rich:dataTable>
			     </fieldset>
             </h:panelGroup> 
				
			<br/>
			<br/>
			<br/>
			<br/>
			<br/>

			
		<a4j:commandButton value="إلغاء"  action="#{saleBacking.cancelSale}"  render="master detail" style="width : 99px; height : 43px;font-weight:bold;font-size:20px;"/>
		<h:commandButton value="حفظ و إغلاق" style="width : 99px; height : 43px;font-weight:bold;font-size:20px;"/>
		<h:commandButton value="حفظ و طباعة" style="width : 99px; height : 43px;font-weight:bold;font-size:20px;"/>
		
		<h:commandButton action="#{saleBacking.insertSale}" styleClass="button"
		                 value="حفظ و جديد" style="width : 99px; height : 43px;font-weight:bold;font-size:20px;">
		        <a4j:ajax  execute="@form" render="master detail status_msg"/>
		</h:commandButton>

   			
   			
	</h:form>			
					 

					 
					 
				</rich:panel>
							
			
</body> 
</html>


